<template>
    <div>
        <div style="margin-top: 15px;">
            <el-input placeholder="请输入学生id以搜索" v-model="input_id" class="input-with-select">
                <el-button slot="append" icon="el-icon-search" v-on:click="findOne"></el-button>
            </el-input>
        </div>

        <br />
        <br />

        <el-table :data="tableData" stripe style="width: 100%">
            <el-table-column prop="id" label="学号">
            </el-table-column>
            <el-table-column prop="account" label="账号">
            </el-table-column>
            <el-table-column prop="gender" label="性别">
            </el-table-column>
            <el-table-column prop="name" label="名字">
            </el-table-column>
            <el-table-column label="操作" width="180">
                <template slot-scope="scope">
                    <el-button size="mini" type="plain" @click="dialogFormVisible = true">编辑</el-button>
                    <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-dialog title="收货地址" :visible.sync="dialogFormVisible">
            <el-form :model="form">
                <el-form-item label="活动名称" :label-width="formLabelWidth">
                    <el-input v-model="form.name" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="活动区域" :label-width="formLabelWidth">
                    <el-select v-model="form.region" placeholder="请选择活动区域">
                        <el-option label="区域一" value="shanghai"></el-option>
                        <el-option label="区域二" value="beijing"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    methods: {
        open3() {



        },
        handleDelete(a, b) {
            console.log(a)
            console.log(b.id)
            var stuid = b.id
            this.$http.get('http://localhost:8081/delete.php?id=' + stuid)
                .then((response) => {
                    console.log(response.data.data)
                    console.log(response.data.code)

                    if (response.data.code == 0) {
                        this.$notify({
                            title: '提示',
                            type: 'success',
                            message: response.data.data.detail + '(' + response.data.msg + ')',
                            duration: 3000
                        })
                        this.tableData.pop()
                    } else {
                        this.$notify({
                            title: '提示',
                            type: 'warning',
                            message: '没有查找到对应学生信息(' + response.data.msg + ')',
                            duration: 3000
                        })
                    }
                }).catch(function(response) {
                    console.log(response)
                });

        },
        findOne: function() {
            //获取值  

            if (this.input_id == '' || this.input_id == 'undefined' || this.input_id == null) {
                this.$message({
                    message: '请输入要查询的学生id！',
                    type: 'error'
                })
                return;
            }

            this.$http.get('http://localhost:8081/findone.php?id=' + this.input_id)
                .then((response) => {
                    console.log(response.data.data)
                    console.log(response.data.code)

                    if (response.data.code == 0) {
                        this.tableData.pop()
                        this.tableData.push(response.data.data)
                        this.$message({
                            message: '查询完成',
                            type: 'success'
                        })
                    } else {
                        this.tableData.pop()
                        this.$notify({
                            title: '提示',
                            type: 'warning',
                            message: response.data.msg,
                            duration: 3000
                        })
                    }
                }).catch(function(response) {
                    console.log(response)
                });
        }
    },
    data() {
        return {
            tableData: [],
            input_id: '',
             gridData: [{
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }],
        dialogTableVisible: false,
        dialogFormVisible: false,
        form: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        },
        formLabelWidth: '120px'
        }
    },
}
</script>
<style>

</style>
